<template>
  <div id="newStrategyName">
    <mt-header fixed title="新建策略" v-if="isHeader">
      <mt-button icon="back" slot="left" @click="goBack"></mt-button>
    </mt-header>
    <div class="reStrategyName-cont" :class="isHeader?'isHeader':''">
      <div class="writ-btn">
        <input maxlength="20" class="input" type="text" v-model="strategy.strategyName">
      </div>
      <div class="tip-text">
        2~20位中文、英文（大小写组合）
      </div>
      <div class="fin-btn" @click="addStrategy">
        完成
      </div>
    </div>
  </div>
</template>

<script>
  import {Toast} from 'mint-ui'
  import REQUEST from './../services/test'
  import {formatDate} from './../utility/date'

  export default {
    name: 'newStrategyName',
    data() {
      return {
        isHeader: false,
        strategy: {
          strategyName: '',
          factorIds: '',
          create_time: ''
        }
      }
    },
    created() {
      this.$store.commit('getUrlParams')
      this.isHeader = this.$store.state.isHeader
    },
    methods: {
      goBack: function () {
        // history.back()
        this.$router.go(-1)
      },
      addStrategy() {
        let _self = this
        if (this.strategy.strategyName === '') {
          Toast({
            message: '策略名称不能为空',
            position: 'bottom',
            duration: 3000
          })
        } else {
          let selectFactors = this.$store.state.selectFactors
          let userInfo = this.$store.state.userInfo
          if (selectFactors.length > 0) {
            REQUEST.allMyStrategys(userInfo).then(res => {
              return res
            }).then(req => {
              let obj = {}
              let ids = []
              selectFactors.forEach(v => {
                ids.push(v.factor_id)
              })
              let isName = req.filter(v => {
                return v.strategy_name === _self.strategy.strategyName
              })
              if (isName.length <= 0) {
                obj.strategyName = _self.strategy.strategyName
                obj.factorIds = ids.join(',')
                REQUEST.addMyStrategys(userInfo, obj.strategyName, obj.factorIds).then(res => {
                  if (res) {
                    Toast({
                      message: '新建策略成功！',
                      position: 'bottom',
                      duration: 3000
                    })
                    obj.back = 0
                    history.go(-1)
//                    this.$router.replace({path: '/factorSortsMore', query: obj})
                  }
                }).catch(err => {
                  Toast({
                    message: '新建策略失败！',
                    position: 'bottom',
                    duration: 3000
                  })
                  console.info(err)
                })
              } else {
                Toast({
                  message: '该策略名称已存在！',
                  position: 'bottom',
                  duration: 3000
                })
              }

            })
          } else {
            Toast({
              message: '未选择因子',
              position: 'bottom',
              duration: 3000
            })
          }
        }
      },
      timeCreate() {
      }
    }
  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss" scoped>
  #newStrategyName {
    .mint-header.is-fixed {
      background-color: #0f1316;
    }
    .reStrategyName-cont.isHeader {
      margin-top: 1.25rem !important;
    }
    .reStrategyName-cont {
      /*margin-top: 1.25rem;*/
      .writ-btn {
        height: 1rem;
        border-bottom: 1px solid #e5e5e5;
        .input {
          height: inherit;
          padding-left: 0.2666667rem;
          width: 100%;
          border: 0;
        }
      }
      .tip-text {
        text-align: left;
        text-indent: 0.2666667rem;
        padding: 0.2666667rem 0;
      }
      .fin-btn {
        height: 1rem;
        line-height: 1rem;
        background: #0f1316;
        margin: 0.2666667rem;
        color: #ffffff;
        font-size: 0.4rem;
        text-align: center;
        border-radius: 0.10666667rem;
      }
    }
  }
</style>
